<template>
  <div class="me">
    <div class="goback" @click="backhome"><img src="../../../assets/backleft.svg" alt="" /></div>
    <div class="cropper">
      <div class="head-img"><img src="../../../assets/geren.png" alt=""></div>
    </div>
    <div class="dolist">
      <ul>
        <li>我的任务<img src="../../../assets/right.svg" alt=""></li>
        <li>我的打卡<img src="../../../assets/right.svg" alt=""></li>
        <li>我的好友<img src="../../../assets/right.svg" alt=""></li>
        <li>个人信息<img src="../../../assets/right.svg" alt=""></li>
        <li>设&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;置<img src="../../../assets/right.svg" alt=""></li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {

  methods: {
    backhome(){
      this.$emit('isclose',false);
    }
  },
};
</script>

<style scoped>
.me {
  width: 100%;
  height: 100%;
  /* position: fixed; */
}
.goback {
  width: 100%;
  height: 44px;
}
.goback img {
  width: 35px;
  height: 35px;
  margin-left: 85%;
  margin-top: 10px;
}
.cropper{
  width: 100%;
  height: 200px;
  margin-top: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.head-img{
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.dolist{
  width: 100%;
  font-size: 18px;
  /* text-align: center; */
}
.dolist ul li{
  height: 60px;
  line-height: 60px;
  /* border-bottom: .5px solid #cccccc; */
  /* float: left; */
  list-style-type: none;
  vertical-align:middle;
}
.dolist ul li img{
  width: 25px;
  height: 25px;
  vertical-align:middle;
  margin-bottom: 6px;
  padding-left: 50%;
}
</style>
